<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>导航页面</title>
    <style>
        *{
            margin: 0;
            padding: 0;
        }
        #container {
            width: 100%;
            height: 100vh;
        }
    </style>
    <script type="text/javascript"> // 本html页面里所使用的地图为高德地图
        window._AMapSecurityConfig = {
            securityJsCode:'3550f3a5226ce0cde9ae729164e98f27', // code和src分别填写我的应用里对应的key密钥和key
        }
    </script>
    <script type="text/javascript" src="https://webapi.amap.com/maps?v=1.4.15&key=c6dd63932be6086d7044f8340b18cace"></script>
</head>
<body>
<div id="container"></div>
    <script>
        var map = new AMap.Map("container", {
            zoom: 15, // 缩放级别
            center: [116.397428, 39.90923], // 位置中心点坐标
        })
        // map.setZoomAndCenter(16, [114.06899, 22.635823]) // 根据经纬度定位到地图的对应位置区域，高德地图的JS API

        // var h5Port
        // // 监听原生的事件，下面也可以通过使用 window.onmessage()
        // window.addEventListener("message", function (event) {
        //     if (event.data === "__init_port__") { // 接收到消息
        //         h5Port = event.ports[0] // 拿到端口
        //         if (h5Port) {
        //             h5Port.postMessage(JSON.stringify({ type: 'connect_ok' })) // 通过端口给原生发消息
        //         }
        //     }
        // })
        // 网页调原生
        window.onload = function () {
            if (window.shenling) {
                // shenling.alert("原生与H5的混合开发")
                shenling.getLocation('getLocation')
            }
        }
        // 原生调网页
        // function test() {
        //     shenling.alert("测试：原生与H5的混合开发")
        // }
        function getLocation(lon, lat) {
            // shenling.alert('经度：'+lon + '\n' + '纬度：'+lat)
            map.setZoomAndCenter(17, [lon, lat]) // 将坐标定位到对应的经纬度上，使用模拟器测试时，可以先在模拟器上设置好
            map.plugin(["AMap.PlaceSearch"], function () {
                var MSearch = new AMap.PlaceSearch({
                    pageSize: 4, // 4条记录
                    pageIndex: 1, // 请求页码，默认1
                    extensions: "base", // 返回信息详略，默认为base（基本信息）
                }) // 构造PlaceSearch类
                AMap.event.addListener(MSearch, "complete", (result) => {
                    // shenling.alert(JSON.stringify(result))
                    // shenling.alert(JSON.stringify(result?.poiList?.pois || []))
                    shenling.receiveData("search_list", JSON.stringify(result?.poiList?.pois || []))
                }) // 返回结果
                MSearch.searchNearBy("地点", new AMap.LngLat(lon, lat)) // 关键字查询
            })
        }
    </script>
</body>
</html>